iT邦幫忙

2021 iThome 鐵人賽

DAY 13
0
Mobile Development

麻瓜學習 iOS 開發系列 第 13

Day13:SwiftUI—Navigation

  • 分享至 

  • xImage
  •  

前言

上篇文章介紹了 SwiftUI - List,
這篇來講如何在一個 list 上導航到不同的 view,
在 SwiftUI 只需利用 NavigationView、NavigationLink 就可以做到。

實作

  • 打開昨天實作 list 的專案:
  • 用 NavigationView 包住這個 list:

    可以發現添加了 NavigationView{} 後,
    preview 畫面上方出現空白欄位,
  • 在這裡我們可以添加 title:

    我們添加了 NavigationBarTitle,
    這邊注意,
    並沒有添加在 NavigationView{} 後面,
    而是放在 NavigationView{} 修飾的第一個 sub view 後面。
  • 調整 navigation title 的大小:

    這邊選擇 automatic
  • 用 NavigationLink 導航到另一個的 view

    NavigationLink 後帶的兩個參數,
    一個是指導航到的目的地,
    另一個則是導航的標籤:

    會發現 preview 畫面上出現了箭頭,
    點進去:

    這帶我們到達了另一個 view,
    如果我們想要更改到達的內容,
    則在 NavigationLink 後帶的第一個參數 destination: 後面更改。

上一篇
Day12:SwiftUI-List
下一篇
Day14:SwiftUI—ForEach、ScrollView
系列文
麻瓜學習 iOS 開發30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言